<template>
	<uni-nav-bar :border="false" backgroundColor="transparent" :fixed="true">
		<block v-slot:left>
			<uni-icons class="rr-icons" color="transparent" type="back" size="30"></uni-icons>
		</block>
	</uni-nav-bar>
	<view class="container">
		<view class="content">
			<view class="head">
				hello!!
				<br />
				<text>欢迎来到{{$store.state.name}}</text>
			</view>
			<view class="box">
				<view class="titlebox">
					<view class="left" @click="$goURl('/pages/login/login')">
						用户登录
					</view>
					<view class="right active">
						用户注册
					</view>
				</view>
				<view class="list">
					<!-- <view class="item">
						<view class="items">
							<view class="image">
								<image src="http://img.shibangszkj.top/shibang/16995013085934.png" mode=""></image>
							</view>
							<input class="uni-input" maxlength="20" v-model="form.user_id" placeholder="请输入账号" />
						</view>
					</view> -->
					<view class="item">
						<view class="items">
							<view class="image">
								<image src="http://img.shibangszkj.top/shibang/16995013085934.png" mode=""></image>
							</view>
							<input class="uni-input" maxlength="11" v-model="form.mobile" placeholder="请输入电话" />
						</view>
					</view>
					<view class="item">
						<view class="items">
							<view class="image">
								<image src="http://img.shibangszkj.top/shibang/16995013316303.png" mode=""></image>
							</view>
							<input class="uni-input" maxlength="6" v-model="form.smg" placeholder="请输入验证码" />
						</view>
						<view class="time" @click="getcode">
							{{time}}
						</view>
					</view>
					<view class="item">
						<view class="items">
							<view class="image">
								<image src="http://img.shibangszkj.top/shibang/16995014668674.png" mode=""></image>
							</view>
							<input class="uni-input" maxlength="11" v-model="form.share" placeholder="请输入分享码(非必填）" />
						</view>
					</view>
					<view class="item">
						<view class="items">
							<view class="image">
								<image src="http://img.shibangszkj.top/shibang/16995013966448.png" mode=""></image>
							</view>
							<input class="uni-input" v-model="form.password" placeholder="请输入密码"
								:password="showPassword" />
						</view>
						<uni-icons :type="!showPassword?'eye-filled':'eye-slash-filled'" size="20"
							@click="changePassword"></uni-icons>
					</view>
				</view>
				<view class=""></view>
				<view class="btnBox" @click="login" :style="{background:checked?'':'#ccc'}">
					注册
				</view>
				<view class="bottom" >
					<label class="radio" @click="checkedchange"
						style="display: flex;align-items: center;justify-content: center;">
						<uni-icons type="checkbox" color="#00C356" v-if="checked" size="20"></uni-icons>
						<uni-icons type="circle" v-else size="20"></uni-icons>
						我已阅读并同意<text v-if="agreement!=2"
							@click="$goURl('/subPackages/personal/agreement/agreement?code=1')">《用户协议》</text><text
							style="color: #666;" v-if="agreement==3">与</text><text v-if="agreement!=1"
							@click="$goURl('/subPackages/personal/agreement/agreement?code=0')">《隐私政策》</text>
					</label>
				</view>
				<view class="bottom" @click="$goURl('/pages/login/login')">
					已有账号!<text>去登录</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive,
		getCurrentInstance
	} from "vue";
	import {
		onLoad,
		onShow
	} from "@dcloudio/uni-app";
	const {
		appContext
	} = getCurrentInstance();
	let form = reactive({
		mobile: '',
		password: '',
		share: '',
		smg: '',
		user_id: ''
	})
	let time = ref('获取验证码')
	let checked = ref(false)
	let showPassword = ref(true)
	let agreement = ref(0)
	onShow(() => {
		agreement.value = uni.getStorageSync('agreement')
		// test()
	})
	onLoad((option) => {
		form.share = option.share
	})

	function checkedchange() {
		console.log(12)
		checked.value = !checked.value
	}

	function getcode() {
		if (!checked.value) {
			uni.showToast({
				icon: 'none',
				position: 'bottom',
				title: '请同意用户协议与隐私协议'
			});
			return false;
		}
		if (time.value != '获取验证码') {
			return false
		}

		if (!(/^1[3456789]\d{9}$/).test(form.mobile)) {
			uni.showToast({
				icon: 'none',
				position: 'bottom',
				title: '手机号不正确'
			});
			return false;
		}
		appContext.config.globalProperties.$request({
			url: `api/smscodesview/`,
			method: 'post',
			data: {
				mobile: form.mobile
			},
			success(res) {
				// uni.showToast({
				// 	icon:'none',
				// 	title:res.errmsg
				// })
				if (res.errno == 0) {
					let times = 60
					let timer = setInterval(function() {
						if (times == 0) {
							time.value = '获取验证码'
							clearInterval(timer)
						} else {
							times--
							time.value = times + 'S重发'
						}
					}, 1000)
				}
			}
		})
	}

	let i = 0
	let j = 0
	let a = 1
	let mobile = 18200000000

	function test() {
		form.smg = '111111'
		form.password = '111111'
		form.mobile = mobile + i
		if (i === 0) {
			form.share = ''
		} else {
			if ((form.mobile - a) == 4) {
				j += 1
			}
			form.share = mobile + j
		}
		i += 1
		if (i < 10) {
			setTimeout(() => {
				test()
			}, 1000)
		}
		console.log("#########", form)
		form.mobile = form.mobile.toString()
		form.share = form.share.toString()
		login()

	}




	function login() {
		// form.mobile = '18200000014'
		// form.smg = '111111'
		// form.password = '111111'

		// form.share = '18200000013'

		if (!checked.value) {
			uni.showToast({
				icon: 'none',
				position: 'bottom',
				title: '请同意用户协议与隐私协议'
			});
			return false;
		}
		if (!(/^1[3456789]\d{9}$/).test(form.mobile)) {
			uni.showToast({
				icon: 'none',
				position: 'bottom',
				title: '手机号不正确'
			});
			return false;
		}

		// if (form.user_id.length < 4) {
		// 	uni.showToast({
		// 		icon: 'none',
		// 		title: "请输入4位以上账号"
		// 	})
		// 	return false
		// }

		// if (form.smg.length != 6) {
		// 	uni.showToast({
		// 		icon: 'none',
		// 		title: "请输入验证码"
		// 	})
		// 	return false
		// }

		// if (!(/^1[3456789]\d{9}$/).test(form.share)) {
		// 	uni.showToast({
		// 		icon: 'none',
		// 		position: 'bottom',
		// 		title: '分享码不正确'
		// 	});
		// 	return false;
		// }  暂时不需要
		if (form.password.length < 6) {
			uni.showToast({
				icon: 'none',
				title: "请输入密码"
			})
			return false
		}
		appContext.config.globalProperties.$request({
			url: `api/register/`,
			method: 'post',
			data: form,
			success(res) {
				if (res.errno == 0) {
					let user = res.data
					user['password'] = form.password
					uni.setStorageSync('userInfo', user)
					let list = uni.getStorageSync('userList') ? uni.getStorageSync('userList') : []
					list = list.filter(item => {
						return item.ID != res.data.ID
					})
					list.unshift(user)
					uni.setStorageSync('userList', list)
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/personal/index'
						})
					}, 1000)
				}
				uni.showToast({
					icon: 'none',
					title: res.errmsg
				})
			}
		})
	}

	function changePassword() {
		console.log('showPassword', showPassword.value)
		showPassword.value = !showPassword.value;
	}
</script>
<style lang="scss" scoped>
	@import '@/static/css/login.scss';
</style>
